<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script language="JavaScript" src="scripts/ts_picker.js"></script>
<style type="text/css">
.style3 {
	height: 23px;
}

#Select1 {
	width: 176px;
}

.style4 {
	width: 187px;
	height: 26px;
}

.style5 {
	height: 26px;
}

.style6 {
	height: 80px;
}

#Reset1 {
	width: 66px;
}

#Submit1 {
	width: 65px;
}

#TextArea1 {
	width: 571px;
	height: 67px;
}
</style>
<title>Apply For Leave</title>


<script type="text/javascript">
	function showAnnual() {
		var r1 = ${sessionScope.ledger.RemainAnnualLeave}
		var t1 = document.getElementById("remaindays");
		t1.value = r1;
		return true;
	}

	function showMedical() {
		var r1 = ${sessionScope.ledger.RemainMedicalLeave}
		var t1 = document.getElementById('remaindays');
		t1.value = r1;
		return true;
	}

	function showCompensation() {
		var r1 = ${sessionScope.ledger.RemainOverTimeHr}
		var t1 = document.getElementById("remaindays");
		t1.value = r1;
		return true;
	}

	function checkapplydata() {

		var d1 = document.leaveform.startdate.value;
		var dd1 = parseInt(d1.replace(/-/g, ""));
		var d2 = document.leaveform.enddate.value;
		var dd2 = parseInt(d2.replace(/-/g, ""));
		var now = new Date();
		var nowint = now.getYear() * 10000 + (now.getMonth() + 1) * 100
				+ now.getDate();

		if ((document.leaveform.leavetype[0].checked == false)
				&& (document.leaveform.leavetype[1].checked == false)
				&& (document.leaveform.leavetype[2].checked == false)) {
			alert("please choose leave type");
			return false;
		}

		if (d1 == "") {
			alert("Please select start date");
			return false;
		}
		if (d2 == "") {
			alert("Please select end date");
			return false;
		}
		if (dd1 > dd2) {
			alert("End date must later than start date");
			return false;
		}
		if (dd1 < nowint) {
			alert("Start date can't earlier than now");
			return false;
		}

		return true;

	}
</script>

</head>
<body>
	<h1>Leave Application</h1>

	<form id="leaveform" action="ApplyLeaveServelet.java" method="POST"
		name="tstest" onSubmit="return checkapplydata();">
		<table cellpadding=4 cellspacing=2 border=0>
			<tr>
				<td class="style4">Employee Name:</td>
				<td><label>${sessionScope.employee.SurName}</label></td>
			</tr>
			<tr>
				<td class="style4">Leave Type:</td>
				<td class="style5"><input id='radio1' name='leavetype'
					type='radio' value='Annual' onclick="showAnnual()">Annual<br>
					<input id='radio2' name='leavetype' type='radio' value='Medical'
					onclick="showMedical()">Medical <br> <input
					id='radio3' name='leavetype' type='radio' value='Compensation'
					onclick="showCompensation()">Compensation</td>
			</tr>

			<tr>
				<td class="style3">Start Date:</td>
				<td class="style3"><input name="startdate" type="text"
					readonly="readonly" /> <a
					href="javascript:show_calendar('document.tstest.startdate', document.tstest.startdate.value);"><img
						src="/images/cal.gif" width="16" height="16" border="0"
						alt="Click Here to Pick up the timestamp"> </a></td>
			</tr>
			<tr>
				<td>End Date:</td>
				<td><input name="enddate" type="text" readonly="readonly" /> <a
					href="javascript:show_calendar('document.tstest.enddate', document.tstest.enddate.value);"><img
						src="/images/cal.gif" width="16" height="16" border="0"
						alt="Click Here to Pick up the timestamp"> </a></td>

				<td><input type="hidden" name="remaindays" value=""></td>
			</tr>
			<tr>
				<td><input name="Submit" id="Submit" type="submit"
					value="submit" /></td>
				<td><input name="Reset" id="Reset" type="reset" value="reset" />
				</td>
			</tr>
		</table>
	</form>